import React from 'react';
import { Box, Alert, CircularProgress } from '@mui/material';
import InfoSection from './InfoSection';
import InfoItem from './InfoItem';
import { GraduationInfo } from '../types';

interface GraduationInfoSectionProps {
    graduationInfo: GraduationInfo | null;
    onEdit: () => void;
    loading?: boolean;
    error?: string | null;
}

const GraduationInfoSection: React.FC<GraduationInfoSectionProps> = ({ graduationInfo, onEdit, loading, error }) => {
    return (
        <InfoSection title="毕业信息" onEdit={onEdit} loading={loading}>
            {error && (
                <Alert severity="error" sx={{ mb: 2 }}>
                    {error}
                </Alert>
            )}

            {loading ? (
                <Box sx={{ display: 'flex', justifyContent: 'center', p: 3 }}>
                    <CircularProgress />
                </Box>
            ) : graduationInfo ? (
                <Box className="form-row" sx={{ gap: 2 }}>
                    <InfoItem label="省厅系统填报" value={graduationInfo.provinceSystemReport} />
                    <InfoItem label="毕业生登记表填报" value={graduationInfo.graduateRegisteReport} />
                </Box>
            ) : (
                <Box sx={{ textAlign: 'center', p: 3 }}>暂无毕业信息</Box>
            )}
        </InfoSection>
    );
};

export default GraduationInfoSection;
